<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>jQ 多库共存</title>
    <script src="lib/jQuery-v3.6.0.min.js"></script>
  </head>
  <body>
    <div>123</div>

    <script>
      $(function () {
        // 自己封装一个函数，名字就叫做 $
        function $(ele) {
          return document.querySelector(ele)
        }
        console.log($('div')) // 输出 div 标签

        // 此时再使用 $('div').text() 会报错
        // console.log($('div').text())  // 因为和上面自己定义的函数冲突了

        // 解决方案1  使用 jQuery 代替 $
        // console.log(jQuery('div').text())

        // 解决方案2  释放对 $ 的控制权，让用户自己决定
        var suibian = jQuery.noConflict()
        console.log(suibian('div').text())
      })
    </script>
  </body>
</html>
